import React from 'react'
import { useState } from 'react';
import { useMemo } from 'react';

export const MemoDemo = ({ num }) => {
    const [val, setVal] = useState('');
    const [sum, setSum] = useState(0);

    const cal = () => {
        let sum = 0;
        console.log(val);
        for (let i = 0; i <= val; i++) {
            sum += i;
        }
        setSum(sum);
    }
    const count = useMemo(
        () => {
        let s = 0;
        for (let i = 0; i <= num; i++) {
            s += i;
        }
        return s;
    }, [num])

return (
    <div>
        <input
            type='text'
            onChange={(e) => setVal(e.target.value)}
        />
        <button onClick={cal}>caculate</button>
        <div>当前组件计算结果{sum}</div>
        <div>父组件传递数据的计算结果{count}</div>
    </div>
)
}
